var $datatable;
var _DATATABLE_TR;
var oTable;
var _SPINNER_MONTH = 0;
var _SPINNER_YEAR = 0;


$(document).ready(function() {
    var spinner_months = $( "#spinner_months" ).spinner({
        spin: function( event, ui ) {
            if ( ui.value > 12 ) {
                $( this ).spinner( "value", 1 );
                return false;
            } else if ( ui.value < 1 ) {
                $( this ).spinner( "value", 12 );
                return false;
            }
        }
    });
    var spinner_years = $( "#spinner_years" ).spinner();
    
    _SPINNER_MONTH = $("#spinner_months").val();
    _SPINNER_YEAR = $( "#spinner_years" ).val();
    
    $datatable = $('#datatable_nb');

    oTable = $datatable.dataTable({
        "bPaginate": false,
        "bFilter" : false,
        "bSort": false,
        "bJQueryUI": true,
        "sPaginationType": "full_numbers",
        "bInfo": false,
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": $('#datatable_nb').attr('active_url'),
        
        "fnServerData": function ( sSource, aoData, fnCallback ) {
            aoData.push( { "name": "filter_month", "value": _SPINNER_MONTH } );
            aoData.push( { "name": "filter_year", "value": _SPINNER_YEAR } );
            
            $.getJSON( sSource, aoData, function (json) { 
                fnCallback(json)
            } );

        },
        
        "fnDrawCallback": function( oSettings ) {
            $("#datatable_nb_wrapper").find(".fg-toolbar").removeClass("ui-widget-header");
            datatable_selected();
        },
        "fnRowCallback": function( nRow, aData, iDisplayIndex ) {
            if( aData['id'] != undefined ){
                $(nRow).attr("value_id",aData['id']);
            }
            //if ( aData[4] == "A" ){$('td:eq(4)', nRow).html( '<b>A</b>' );}
            return nRow;
        }
        //"oTableTools": {"aButtons": ["copy", "csv", "xls", "pdf"]}
        
    });

    dialogFormAddNewNB();
    dialogConfrimDeleteNB();
    dialogFormEditNB();
    dialogError();
} );

function datatable_filter_MY(){
    _SPINNER_MONTH = $("#spinner_months").val();
    _SPINNER_YEAR = $("#spinner_years").val();
    oTable.fnDraw();
}

function datatable_selected(){
    $datatable.find('tbody tr').click( function( e ) {
        if ( $(this).hasClass('row_selected') ) {
            $(this).removeClass('row_selected');
            _DATATABLE_TR = null;
        }else {
            oTable.$('tr.row_selected').removeClass('row_selected');
            $(this).addClass('row_selected');
            _DATATABLE_TR = $(this).attr('value_id');
        }
    });
    
    $datatable.find('tbody tr').bind("dblclick", function(){
        if ( !$(this).hasClass('row_selected') ) {
            $(this).addClass('row_selected');
        }
        _DATATABLE_TR = $(this).attr('value_id');
        edit_nb_dbclick( _DATATABLE_TR );

    });

}

function dialogFormAddNewNB(){
    
    $( "#dialog_form_add" ).dialog({
        autoOpen: false,
        //height: 300,
        width: 320,
        modal: true,
        resizable: true,
        buttons: {
            "Save": function() {
                var $this = $( this );
                $("#frm_nb").ajaxSubmit({
                    //beforeSubmit: validate
                    dataType:  'json',
                    beforeSubmit: function(formData, jqForm, options) {
                        var flag = true;
                        var ten = $('input[name=ten]').val(); 
                        var dienthoai = $('input[name=dienthoai]').val();
                        if(ten == ''){
                            $("input[name=ten]").addClass("i-error");
                            $("#iten").show();
                            flag = false;
                        }else{
                            $("#iten").hide();
                            $("input[name=ten]").removeClass("i-error");
                        }
                        
                        if(dienthoai == ''){
                            $("input[name=dienthoai]").addClass("i-error");
                            $("#idienthoai").show();
                            flag = false;
                        }else{
                            $("#idienthoai").hide();
                            $("input[name=dienthoai]").removeClass("i-error");
                        }
                        
                        return flag;
                        
                    },
                    success: function(data) {
                        if(data.action == 'insert'){
                            //oTable.fnDraw();
                            //oTable.fnFilter( data.ten );
                            oTable.fnSort( [ [0,'desc'] ] );
                        }else if(data.action == 'update'){
                            var $tr = oTable.$('tr[value_id="'+ data.id +'"]');
                            $tr.find('td:eq(1)').html(data.ten);
                            $tr.find('td:eq(2)').html(data.tenkhu);
                            $tr.find('td:eq(3)').html(data.dienthoai);
                        }
                        $this.dialog( "close" );
                    }
                });
            },
            Cancel: function() {
                $( this ).dialog( "close" );
            }
        },
        close: function() {
            $("#dialog_form_add").html('');
        }
    });
        
}

function dialogFormEditNB(){
    
    $( "#dialog_form_edit" ).dialog({
        autoOpen: false,
        //height: 300,
        width: 320,
        modal: true,
        resizable: true,
        buttons: {
            "Save": function() {
                var $this = $( this );
                $("#frm_nb").ajaxSubmit({
                    //beforeSubmit: validate
                    dataType:  'json',
                    beforeSubmit: function(formData, jqForm, options) {
                        var flag = true;
                        var ten = $('input[name=ten]').val(); 
                        var dienthoai = $('input[name=dienthoai]').val();
                        if(ten == ''){
                            $("input[name=ten]").addClass("i-error");
                            $("#iten").show();
                            flag = false;
                        }else{
                            $("#iten").hide();
                            $("input[name=ten]").removeClass("i-error");
                        }
                        
                        if(dienthoai == ''){
                            $("input[name=dienthoai]").addClass("i-error");
                            $("#idienthoai").show();
                            flag = false;
                        }else{
                            $("#idienthoai").hide();
                            $("input[name=dienthoai]").removeClass("i-error");
                        }
                        
                        return flag;
                        
                    },
                    success: function(data) {
                        if(data.action == 'insert'){
                            //oTable.fnDraw();
                            //oTable.fnFilter( data.ten );
                            oTable.fnSort( [ [0,'desc'] ] );
                        }else if(data.action == 'update'){
                            var $tr = oTable.$('tr[value_id="'+ data.id +'"]');
                            $tr.find('td:eq(1)').html(data.ten);
                            $tr.find('td:eq(2)').html(data.tenkhu);
                            $tr.find('td:eq(3)').html(data.dienthoai);
                        }
                        $this.dialog( "close" );
                    }
                });
            },
            Cancel: function() {
                $( this ).dialog( "close" );
            }
        },
        close: function() {
            $("#dialog_form_edit").html('');
        }
    });
        
}

function dialogConfrimDeleteNB(){
    
    $( "#dialog_confrim_delete" ).dialog({
        autoOpen: false,
        //height: 300,
        width: 320,
        modal: true,
        resizable: true,
        buttons: {
            "Delete": function() {
                var url = $("#dialog_confrim_delete").attr('active_url');
                
                $.post(url, { id: _DATATABLE_TR },function(data){
                     //alert(data.message);
                     oTable.fnDraw();
                }, "json");
                
                $( this ).dialog( "close" );
            },
            Cancel: function() {
                $( this ).dialog( "close" );
            }
        },
        close: function() {
            //allFields.val( "" ).removeClass( "ui-state-error" );
        }
    });
        
}

function add_nb(){
    var url = $("#dialog_form_add").attr('active_url');
        
    $.get(url, function(data) {
        $( "#dialog_form_add" ).html( data );
        $( "#dialog_form_add" ).dialog( "open" );
    });
}

function delete_nb(){
    if(_DATATABLE_TR != null){
        $( "#dialog_confrim_delete" ).dialog( "open" );
    }else{
        $( "#dialog_error" ).html( "Chua chon item" );
        $( "#dialog_error" ).dialog( "open" );
    }
        
}

function edit_nb(){
    if(_DATATABLE_TR != null){
        var url = $("#dialog_form_edit").attr('active_url') + '/' + _DATATABLE_TR;
        
        $.get(url, function(data) {
            $( "#dialog_form_edit" ).html( data );
            $( "#dialog_form_edit" ).dialog( "open" );
        });
    }else{
        $( "#dialog_error" ).html( '<div>Chua chon item Chua chon item Chua chon item<div>' );
        $( "#dialog_error" ).dialog( "open" );
    }
        
}

function edit_nb_dbclick(id){
    var url = $("#dialog_form_edit").attr('active_url') + '/' + id;
        
    $.get(url, function(data) {
        $( "#dialog_form_edit" ).html( data );
        $( "#dialog_form_edit" ).dialog( "open" );
    });
}